<template>
    <div class="min-h-screen bg-[#111315] select-none">
        <!-- 顶部导航栏 -->
        <GlobalHeader />

        <!-- Hero 区域 - 全屏三栏产品展示 -->
        <Hero />

        <div class="w-full relative flex flex-col items-center justify-center">
            <!-- 标题部分 -->
            <Summary />

            <!-- 三个数字统计区域 -->
            <Stats />

            <!-- 产品类别图标区域 -->
            <Category />

            <!-- 女装宣传区域 -->
            <Advertising />

            <!-- 畅销产品区域 -->
            <Product />

            <!-- 页脚 -->
            <GlobalFooter />
        </div>
    </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue';
import GlobalHeader from '@/components/header/global.vue';
import GlobalFooter from '@/components/footer/index.vue';
import Hero from './components/hero.vue';
import Stats from './components/stats.vue';
import Summary from './components/summary.vue';
import Product from './components/product.vue';
import Category from './components/category.vue';
import Advertising from './components/advertising.vue';

export default defineComponent({
    name: 'HomePage',
    components: {
        GlobalHeader,
        GlobalFooter,
        Hero,
        Summary,
        Stats,
        Product,
        Category,
        Advertising
    }
});
</script>